<template>
  <div>
    <h1>vuexmodules</h1>
    <h2>{{$store.state.car.price}}</h2>
    <h2>{{car.price}}</h2>
    <button @click="testAdd">add</button>
    <button @click="add">add test mapmutations</button>
    <button @click="testSum">sum</button>
    <button @click="sum">sum test mapActions</button>
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions } from "vuex";
export default {
  mounted() {
    // this.$store
    console.log(this.$store);
  },
  computed: {
    ...mapState(["car"])
  },
  methods: {
    testAdd() {
      this.$store.commit("add");
    },
    testSum() {
      this.$store.dispatch("sum");
    },
    ...mapMutations(["add"]),
    ...mapActions(["sum"])
  }
};
</script>

<style>
</style>